<template>
    <input
      @focus="isFocus=true"
      @blur="isFocus=false"
      :class="{ inputFocus:isFocus,inputBlur:false}"
    />
</template>
<script>
export default {
    data() {
        return{
            isFocus:false,
        }
    },
    methods:{},
}
</script>
<style scoped>
input{
    width:10px;
    transition: all 1s;

}
.inputFocus{
    width: 150px;
}
.inputBlur{
    width: 10px;
}
</style>
